/**
 * @name TodoFilter
 * @desc 待办过滤
 * @author darcrand
 * @version 2018-10-14
 */

import React, { Component } from "react"
import "./styles.css"

const types = ["ALL", "UNDO", "DONE"]

class TodoFilter extends Component {
    static defaultProps = {
        type: "",
        handleUpdateFilter: type => {}
    }

    render() {
        const { type, handleUpdateFilter } = this.props
        return types.map((obj, index) => (
            <span key={`type-${index + 1}-${obj}`} className={obj === type ? "todo-type-active" : "todo-type"} onClick={() => handleUpdateFilter(obj)}>
                {obj}
            </span>
        ))
    }
}

export default TodoFilter
